<template>
    <div>
        <el-button type="text" @click="closeSearch">
            {{ SearchTitle }} &nbsp;
            <i v-if="showAll">
                <el-icon><ArrowDownBold /></el-icon>
            </i>
            <i v-else>
                <el-icon><ArrowUpBold /></el-icon>
            </i>
        </el-button>
    </div>
</template>
<script>
export default {
    name: 'SearchButton',
    props: {
        showAll: {
            type: Boolean,
            default: true
        }
    },
    data() {
        return {}
    },
    computed: {
        SearchTitle: function () {
            if (this.showAll) {
                // 对文字进行处理
                return '展开搜索'
            } else {
                return '收起搜索'
            }
        }
    },
    methods: {
        closeSearch() {
            this.$emit('closepop')
            console.log('子组件的状态：' + this.showAll)
        }
    }
}
</script>
<style scoped></style>
